#{extends 'main.html' /}
#{set title:'commercialOfferer.html' /}

<h1>Register as a Commercial Offerer</h1>
<br>
<span> Change status : </span>
<span><a class=text href=registerCommercial>commercial</a></span> or
<span><a class=text href=registerPrivate> private</a></span>
<br>
#{ifErrors}
<div class="error">
    <h3>please correct these errors</h2>
</div>
#{/ifErrors}
<div id="styledForm">
#{form @Registration.registerCommercial()}
    <fieldset>              
        <legend>Hotel information</legend>  

		<div class="field">     
            <label for="hotelname">*Hotel name</label>                    
            <input id="hotelname" type="text" name="hotelname" size="30" value="${flash.hotelname}" class="#{errorClass 'hotelname' /}" /> 
            <span class="error">#{error 'hotelname' /}</span>
       	</div>
                <div class="field">
        	<label for="hotellink">Hotel Link</label>                     
            <input id="hotellink" type="text" name="hotellink" size="30" value="${flash.hotellink}" class="#{errorClass 'hotellink' /}" /> 
            <span class="error">#{error 'hotellink' /}</span>
        </div>
        <div class="field">
        	<label for="stars">Stars</label>
        	#{select 'stars', items:stars} 
			#{/select}
        </div> 
	</fieldset>          
    <fieldset>
    	<legend>User information</legend>
    	
    	<div class="field">     
            <label for="firstname">*First name</label>                    
            <input id="firstname" type="text" name="firstname" size="30" value="${flash.firstname}" class="#{errorClass 'firstname' /}" /> 
            <span class="error">#{error 'firstname' /}</span>
       	</div>
        <div class="field">
            <label for="lastname">*Last name</label>                  
            <input id="lastname" type="text" name="lastname" size="30" value="${flash.lastname}" class="#{errorClass 'lastname' /}" /> 
            <span class="error">#{error 'lastname' /}</span>
        </div>  
        <div class="field">
        	<div class="field">
        	<label for="birthDateString">*Born on</label>
        	<input id="birthDateString" type="date" name="birthDateString" size="30" value="${flash.birthDateString}" class="#{errorClass 'birthDateString' /}"/>
			<span class="error">#{error 'age' /}</span>	
			</div> 
        </div>
    
        <div class="field">     
            <label for="street">*Street</label>                     
            <input id="street" type="text" name="street" size="30" value="${flash.street}" class="#{errorClass 'street' /}" /> 
            <span class="error">#{error 'street' /}</span>
        </div>            
        <div class="field">   
            <label for="streetNumber">*Number</label>                     
            <input id="streetNumber" type="text" name="streetNumber" size="3" value="${flash.streetNumber}" class="#{errorClass 'streetNumber' /}" /> 
            <span class="error">#{error 'streetNumber' /}</span>
        </div>    
        
        <div class="field">
            <label for="zipcode">*Zipcode</label>                     
            <input id="zipcode" type="text" name="zipcode" size="6" value="${flash.zipcode}" class="#{errorClass 'zipcode' /}" /> 
            <span class="error">#{error 'zipcode' /}</span>
        </div>   
        
        <div class="field">
        	<label for="city">*City</label>                     
            <input id="city" type="text" name="city" size="15" value="${flash.city}" class="#{errorClass 'city' /}" /> 
            <span class="error">#{error 'city' /}</span>
        </div>
        
        <div class="field">
        	<label for="phone">Phone</label>                     
            <input id="phone" type="text" name="phone" size="15" value="${flash.phone}" class="#{errorClass 'phone' /}" /> 
            <span class="error">#{error 'phone' /}</span>
        </div>  
            
    </fieldset>
    
    <fieldset>              
        <legend>Email</legend>      
        
        <div class="field">             
            <label for="email">*Email address</label>                     
            <input id="email" type="text" name="email" size="30" value="${flash.email}" class="#{errorClass 'email' /}" /> 
            <span class="error">#{error 'email' /}</span>
        </div>              
        
        <div class="field">     
            <label for="emailConfirm">*Confirm email</label>                  
            <input id="emailConfirm" type="text" name="emailConfirm" size="30" value="${flash.emailConfirm}" class="#{errorClass 'emailConfirm' /}" />
            <span class="error">#{error 'emailConfirm' /}</span>
        </div>
        
    </fieldset>   
             
    
    <fieldset>              
        <legend>Password</legend>               
        
        <div class="field">     
            <label for="password">*Password</label>                   
            <input id="password" type="password" name="password" value="${flash.password}" class="#{errorClass 'password' /}" /> 
            <span class="error">#{error 'password' /}</span>
        </div>              
        
        <div class="field">     
            <label for="passwordConfirm">*Confirm pass</label>                    
            <input id="passwordConfirm" type="password" name="passwordConfirm" value="${flash.passwordConfirm}" class="#{errorClass 'passwordConfirm' /}" /> 
            <span class="error">#{error 'passwordConfirm' /}</span>
        </div>
                    
    </fieldset>                         

    <fieldset>              
        <legend>Captcha</legend>
        
            <img src="@{Registration.captcha(randomID)}" />
            <br />
        
        <div class="field">
        	<label for="code">*Enter captcha</label>
            <input type="text" name="code" id="code" size="18" value="" class="#{errorClass 'code' /}" /> 
            <span class="error">#{error 'code' /}</span>
            <input type="hidden" name="randomID" value="${randomID}" />
        </div>                     
    </fieldset>     
    * = mandatory fields <br> <br>                
    <input type="submit" class="submit" value="register" />
    
#{/form}
</div>
